<template>
  <div class="global-box add-goods">
    <a-card :body-style="{ padding: '24px' }" :bordered="false">
      <a-steps :current="ruleCurrent" class="steps" v-if="classMValue === 0">
        <a-step v-for="item in ruleSteps" :key="item.title" :title="item.title" />
      </a-steps>
      <a-steps :current="aboutClassCurrent" class="steps" v-if="classMValue === 1">
        <a-step v-for="item in aboutClassSteps" :key="item.title" :title="item.title" />
      </a-steps>
      <info
        v-if="
          (ruleCurrent === 0 && classMValue === 0) || (aboutClassCurrent === 0 && classMValue === 1)
        "
        @nextStep="nextStep(arguments)"
        @modeInfo="getModel"
        :classMValue="classMValue"
        :params="this.$route.params"
      ></info>
      <learning-info
        v-if="ruleCurrent === 1"
        @nextStep="nextStep"
        @prevStep="prevStep"
      ></learning-info>
      <classService-info
        v-if="aboutClassCurrent === 1"
        @nextStep="nextStep"
        @prevStep="prevStep"
      ></classService-info>
      <price
        v-if="ruleCurrent === 2 || aboutClassCurrent === 2"
        @prevStep="prevStep"
        @sbumitAdd="sbumitAdd"
        :classMValue="classMValue"
        :params="this.$route.params"
      ></price>
    </a-card>
  </div>
</template>
<script>
import Info from './infoMation'
import LearningInfo from './learningInfo'
import Price from './price'
import ClassServiceInfo from './classServiceInfo'
export default {
  components: {
    Info,
    LearningInfo,
    Price,
    ClassServiceInfo
  },
  data () {
    return {
      ruleCurrent: 0,
      ruleSteps: [
        {
          title: '基本信息'
        },
        {
          title: '学习包信息'
        },
        {
          title: '价格信息'
        }
      ],
      aboutClassCurrent: 0,
      aboutClassSteps: [
        {
          title: '基本信息'
        },
        {
          title: '课程服务信息'
        },
        {
          title: '价格信息'
        }
      ],
      classMValue: 0,
      dataList: {},
      packageId: ''
    }
  },
  mounted () {
  },
  methods: {
    // 下一步
    nextStep () {
      if (this.classMValue === 0) {
        if (this.ruleCurrent < 2) {
          this.ruleCurrent++
        }
      } else {
        if (this.aboutClassCurrent < 2) {
          this.aboutClassCurrent++
        }
      }
    },
    // 上一步
    prevStep () {
      if (this.classMValue === 0) {
        if (this.ruleCurrent > 0) {
          this.ruleCurrent--
        }
      } else {
        if (this.aboutClassCurrent > 0) {
          this.aboutClassCurrent--
        }
      }
    },
    // 上课模式切换
    getModel (v) {
      this.classMValue = v
    },
    // 提交并添加
    sbumitAdd (v) {
      this.classMValue = 0
      this.ruleCurrent = v
      this.aboutClassCurrent = v
      console.log(v)
    }
  }
}
</script>
<style lang="less" scoped>
.add-goods {
  .steps {
    width: 50%;
    margin: 30px auto;
  }
}
</style>
